﻿/* CSS Document */
.banner {background:#000;margin:0 auto;position:relative;}
.banner .bd {position:relative;z-index:0;}
.banner .bd li img {width:100%;vertical-align:top;}
.banner .hd {position:absolute;bottom:5%;width:100%;height:14px;z-index:1;}
.banner .hd ul {width:90%;margin:0 auto;text-align:center;}
.banner .hd ul li {display:inline-block;*display:inline;zoom:1;width:60px;height:7px;margin:0 3px;/*border-radius:50%;*/ background:#464646;line-height:999px;overflow:hidden;cursor:pointer;}
.banner .hd ul .on {background:#fffc01;}






.h1-tlt{margin:30px auto 0;font-size:36px;line-height:48px;color:#000;font-weight:300;text-align:center;letter-spacing:5px;}
 
.en-tlt{margin:5px auto 0;font-size:14px;line-height:18px;color:#000;font-weight:300;text-align:center;letter-spacing:2px;}


.about{height:480px;background:#fff;}
.about-l{margin:71px 45px 0 0;width:calc(50% - 45px);height:375px;float:left; }
.about-l img{width:calc(100% - 20px);height:auto;margin:10px;}
.about-r{width:calc(50% - 45px);float:left;margin:71px 0 0 45px;}
.about-r .con{width:570px;}
.about-r .con h1{font-size:30px;color:#333;line-height:50px;}
.about-r .con h6{font-size:14px;color:#e4263b;font-weight:400;}
.about-r .con p{margin:20px auto;text-indent: 2em;color:#333;    line-height: 24px;}
.about-r .more{width:115px;height:36px;line-height:36px;background:#2756a8;padding:0 30px;float:right;border-radius: 5px;}
.about-r .more a{font-size:12px;color:#fff;padding-left:10px;letter-spacing:3px;}
.about-r .more span{margin:9px;width: 16px;height: 16px; line-height:14px;float: left;color:#fff;font-size:16px;padding-left:1px;text-align:center; }

 @media screen and (max-width: 1024px) {
.about-l{margin:71px 20px 0 0;width:calc(50% - 20px);height:375px;float:left;background:#fff url(../images/sec-bg.jpg) no-repeat right top;}
.about-r{width:calc(50% - 20px);float:left;margin:71px 0 0 20px;}
.about-r .con{width:98%;margin-right:2%;}
 }
@media screen and (max-width: 768px) {
.hot-key{display:none;}	
.banner .hd {bottom:15%;}
.search{height:100px;}
.about{height:auto;}
.about-l{margin:10px 1%;width:98%;background:#fff url(../images/sec-bg.jpg) no-repeat center top;}
.about-r{margin:10px 1%;width:98%;}
.about-r .con{width:100%;}
.about-r .con h1{font-size:30px;text-align:center;}
.about-r .con h6{text-align:center;}
.about-r .more{margin:0 calc(50% - 88px);}
}
.ad-white-line{border-top:solid 2px #fff;width:500px;height:2px;margin:15px calc(50% - 250px) 5px;}
.products-list{width:100%;height:auto;background:#fff url(../images/s-bg.png)  repeat;}
.products-list .con{padding:55px 0 0 0;}
.products-list .con .h2-tlt{height:44px;line-height:44px;font-size:36px;color:#fff;text-align:center;}
.products-list .con h6{font-size:16px;font-weight:300;text-align:center;color:#fff;line-height:30px;}
.products-list li{float:left;width:calc(25% - 24px);height:auto;margin:35px 12px;    position: relative;
}
.products-list li img{width:100%;height:auto;}
 
 
.products-list li .pro-bg{display:none;position: absolute;width:calc(100% - 60px);height:calc(100% - 20px);background:url(../images/pro-bg.png) repeat left top;transition: ease-in-out .5s; padding:10px 30px; }
.products-list li:hover .pro-bg{display:block;left: 0;bottom:  0px;transition: ease-in-out .5s;}
.products-list li:hover .pro-bg h3{height:25%;line-height:18px;text-align:center;color:#fff;overflow:hidden;    border-bottom: solid 1px #fff;}
.products-list li:hover .pro-bg h3 a{font-size:18px;padding:2% 0 10px;color:#fff;}
.products-list li .pro-bg p{padding-top:6px;color:#fff;font-size:12px;line-height:14px;height:56px;overflow:hidden;}
.products-list li .pro-bg .more{width:100px;height:24px;line-height:24px;padding:0 30px; margin:15px calc(50% - 81px);border-radius: 5px;background:#fff;}
.products-list li .pro-bg .more a{font-size:12px;color:#333;padding-left:10px;letter-spacing:3px;}
.products-list li .pro-bg .more span{margin:4px;width: 16px;height: 16px; line-height:14px;float: left;color:#333;font-size:16px;padding-left:1px;text-align:center; }



@media screen and (max-width: 768px) {
.products-list{width:100%;height:auto;background:#fff url(../images/s-bg.png) repeat center top;}
.products-list .con{padding:10px 0 0 0;}
.ad-white-line{border-top:solid 1px #fff;width:300px;height:1px;margin:8px calc(50% - 150px) 4px;}
.products-list li{width:calc(100% - 48px);height:auto;margin:20px 24px;}
.products-list .con .h2-tlt{height:30px;line-height:30px;font-size:20px;}
.products-list .con h6{font-size:14px;line-height:22px;}
.products-list li h3{height:40px;line-height:40px;}
.products-list li h3 a{font-size:12px;}
}

.ad {width:100%;} 
.ad img{width:100%;height:auto;}
 
.News{background:#fff;padding-bottom:36px;}
.News .hd{width:30%; margin:20px 35%;}
.News .hd li{width:calc(50% - 20px);margin:0 10px;float:left;text-align:center;}
.News .hd ul li a{display:block;padding:0 15px;background:#fff;border-radius:15px;border:solid 1px #777;line-height:24px;color:#333;transition: ease-in-out .5s; }
.News .hd ul li a:hover {text-decoration:none;border:solid 1px #e4263b;border-radius:15px;background:#e4263b;color:#fff;}
.News .hd ul li.on a{background:#e4263b;color:#fff;font-weight:bold;border:solid 1px #e4263b;border-radius:10px;}

.News-inner .head-news{width:500px;margin:10px 10px 10px 0;float:Left;}
.News-inner .head-news .pic img{width:100%;height:auto;}
.News-inner .head-news .con{margin:5px auto;padding:5px;border-top:solid 1px #b9b9b9;}
.News-inner .head-news .con h4{text-align:center;line-height:30px;height:30px;overflow:hidden;}
.News-inner .head-news .con h4 a{color:#333;font-size:20px;}
.News-inner .head-news .con .desc{font-size:13px;color:#b7b7b7;line-height:18px;height:36px;overflow:hidden;}
.News-inner .head-news .more{width:90px;height:30px;line-height:30px;background:#e4263b;border: 1px solid #e4263b ;padding:0 15px;margin:10px 15px 10px 0;float:right;transition: ease-in-out .5s; }
.News-inner .head-news .more:hover{background:#fff;}
.News-inner .head-news .more a{font-size:12px;color:#fff;padding-left:2px;transition: ease-in-out .5s; }
.News-inner .head-news .more span{margin:9px 9px 7px;width: 12px;height: 12px; line-height:12px;float: left;border-radius: 50%;background-color: #e4263b;border: 1px solid #fff ;color:#fff;font-size:12px;padding-left:0px;text-align:center; transition: ease-in-out .5s; }
.News-inner .head-news .more:hover span{ border: 1px solid #e4263b ;color:#e4263b;    background-color: #fff;}
.News-inner .head-news .more:hover a{color:#e4263b;}


.News-inner .newslist{width:calc(100% - 520px);margin:10px 0 10px 10px;float:Left;}
.News-inner .newslist li {width:100%;height:auto;float:left;overflow:hidden;margin:5px 0 10px 0;padding:8px 2px;border-bottom:solid 1px #b9b9b9;}
.News-inner .newslist .data{width:80px;border:solid 1px #b9b9b9;text-align:center;float:left;color:#e4263b;}
.News-inner .newslist .data .mm-day{width:100%;height:55px;}
.News-inner .newslist  .data .day{font-size:36px;font-weight:500;padding:5px 0 0 0;line-height:45px;    float:left;}
.News-inner .newslist  .data .mm{margin-top:16px;float:left;font-size:20px;font-weight:500;}
.News-inner .newslist  .data .yy{font-size:14px;font-weight:300;line-height:26px;width:100%;background:#ebebeb;}
.News-inner .newslist li .figcaption {width:calc(100% - 112px);float:left;margin:0 10px 0 20px;}
.News-inner .newslist li .figcaption .n-tlt{font-size:16px;line-height:20px;height:20px;overflow:hidden;}
.News-inner .newslist li .figcaption .n-tlt a{font-weight:500;color:#333;}
.News-inner .newslist li .figcaption .c-p{font-size:12px;color:#979797;line-height:20px;height:20px;overflow:hidden;font-weight:200;}
.News-inner .newslist li .figcaption .n-p{font-size:12px;color:#979797;line-height:20px;height:40px;overflow:hidden;font-weight:200;}

@media screen and (max-width: 768px) {
.News .hd{width:90%; margin:20px 5%;}
.News-inner .head-news{width:calc(100% - 20px);margin:10px;}
.News-inner .newslist{width:calc(100% - 20px);margin:10px;}
}




